@extends('cms/system/admin/template/theme_default/common')
@section('page-body')
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-form layui-form-pane" id="recharge-app-form" lay-filter="recharge-app-form">
                    <div class="layui-form-item">
                        <label class="layui-form-label">应用名称</label>
                        <div class="layui-input-block">
                            <input class="layui-input" type="text" name="name" value="{{$data['name'] ?? ''}}" placeholder="请输入名称" autocomplete="off" lay-verify="required" required />
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">应用类型</label>
                        <div class="layui-input-block">
                            <select id="type" name="type" lay-filter="type">
                                @if(isset($data))
                                    @foreach($type as $type_k => $type_v)
                                        <option value="{{$type_k}}" {{$data['type'] == $type_k ? 'selected' : 'disabled'}}>{{$type_v['name']}}</option>
                                    @endforeach
                                @else
                                    @foreach($type as $type_k => $type_v)
                                        <option value="{{$type_k}}">{{$type_v['name']}}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item" id="app-type-area"></div>
                    <div class="layui-form-item layui-hide">
                        <input type="button" value="添加" id="submit-create" lay-submit lay-filter="submit-create" />
                        <input type="button" value="更新" id="submit-update" lay-submit lay-filter="submit-update" />
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/html" id="app-type-template">
        @{{# if (d.field) { }}
        <fieldset class="layui-elem-field">
            <legend>扩展字段</legend>
            <div class="layui-field-box layui-form-pane">
                @{{# layui.each(d.field, function (field_k, field_v) { }}
                <div class="layui-form-item">
                    <label class="layui-form-label">@{{ field_v.name }}</label>
                    <div class="layui-input-block">
                        <input class="layui-input" type="text" name="setting[type_field][@{{ field_k }}]" value="@{{ field_v.value }}" />
                    </div>
                </div>
                @{{# }); }}
            </div>
        </fieldset>
        @{{# } }}
    </script>
    <script type="text/javascript">
        layui.config({
            base: '/layui-admin/'
        }).extend({
            index: 'lib/index'
        }).use(['index'], function () {
            // 类型设置
            var appTypeSetting = @json($type);
            // 应用类型
            var appTypeValue = layui.$('#type').val();
            var appTypeConfig = appTypeSetting[appTypeValue];
            var appTypeArea = layui.$('#app-type-area');
            var appTypeTemplate = layui.$('#app-type-template').html();
            // 渲染数据
            layui.laytpl(appTypeTemplate).render(appTypeConfig, function (html) {
                appTypeArea.html(html);
                layui.form.render();
            });
            // 类型切换
            layui.form.on('select(type)', function (data) {
                appTypeConfig = appTypeSetting[data.value];
                // 渲染数据
                layui.laytpl(appTypeTemplate).render(appTypeConfig, function (html) {
                    appTypeArea.html(html);
                    layui.form.render();
                });
            });

            // 创建
            layui.form.on('submit(submit-create)', function (data) {
                // 获取提交的字段
                var formField = data.field;
                // ajax提交
                layui.$.ajax({
                    url: layui.setter.apiLink + '/recharge/admin_app/create',
                    type: 'POST',
                    data: formField,
                    success: function (result) {
                        console.log('提交结果：', result);
                        window.sourceWindow.layui.table.reload('recharge-app-list');
                    }
                });
            });
            // 更新
            layui.form.on('submit(submit-update)', function (data) {
                // 获取提交的字段
                var formField = data.field;
                // ajax提交
                layui.$.ajax({
                    url: layui.setter.apiLink + '/recharge/admin_app/update?id={{$data['id'] ?? 0}}',
                    type: 'POST',
                    data: formField,
                    success: function (result) {
                        console.log('提交结果：', result);
                        // 重载表格
                        parent.layui.table.reload('recharge-app-list');
                        // 关闭弹层
                        parent.layer.close(layerIndex);
                    }
                });
            });
        });
    </script>
@endsection